<template>
	<view class="t-login">
		<view class="t-b">{{title}}</view>
		<form class="cl">
			<view class="t-a">
				<!-- <image src="@/static/sj.png"></image> -->
				<i class="zi zi_mobilealt"></i>
				<input name="phone" placeholder="请输入手机号" />
			</view>
			<view class="t-a">
				<!-- <image src="@/static/yz.png"></image> -->
				<i class="zi zi_govGayz"></i>
				<input name="code" placeholder="请输入验证码" />
				<view class="t-c">发送短信</view>
			</view>
			<view class="t-d">未注册的手机号验证后将自动注册</view>
			<button form-type="submit">立即登录</button>
		</form>
		<view class="t-f">登录即同意<text>用户协议</text></view>
		<view class="t-e cl">
			<view class="t-g">
				<i class="zi zi_tmWeixin zi_2x"></i>
				<!-- <image src="@/static/wx.png"></image> -->
				<view>小程序登录</view>
			</view>
			<!-- <view class="t-g">
		        <i class="zi zi_tmWeixin zi_2x"></i>
		        <view>QQ</view>
		    </view> -->
		</view>
	</view>
</template>
<script>
	export default {
		data() {
			return {
				title: '欢迎登录账号',
			}
		},
		onLoad() {

		},
		methods: {

		}
	}
</script>
<style lang="scss" scoped>
	.t-login {
		width: 100%;
		height: 100%;
		padding: 0rpx 60rpx;
		font-size: 28rpx;
		color: #000;
		background-color: white;
	}

	.t-login button {
		font-size: 28rpx;
		// background: #FFD700;
		background: linear-gradient(to bottom right, #FFD700, #F2E20D); /* 从鲜艳的黄色到橙色的渐变背景 */
		color: #000;
		height: 90rpx;
		line-height: 90rpx;
		border-radius: 50rpx
	}

	.t-login input {
		padding: 0 20rpx 0 120rpx;
		height: 90rpx;
		line-height: 90rpx;
		margin-bottom: 50rpx;
		background: #f4f4f4;
		font-size: 28rpx;
		border-radius: 50rpx
	}

	.t-login .t-a {
		position: relative
	}

	.t-login .t-a i {
		position: absolute;
		left: 35rpx;
		border-right: 2rpx solid #dedede;
		padding-right: 20rpx;
		font-size: 50rpx;
		line-height: 95rpx;
		color: #FFD700;
	}

	.t-login .t-b {
		text-align: center;
		font-size: 46rpx;
		color: #000;
		padding: 100rpx 0
	}

	.t-login .t-c {
		position: absolute;
		right: 22rpx;
		top: 22rpx;
		// background: #FFD700;
		background: linear-gradient(to bottom right, #FFD700, #F2E20D);
		color: #000;
		font-size: 24rpx;
		border-radius: 50rpx;
		height: 50rpx;
		line-height: 50rpx;
		padding: 0 25rpx
	}

	.t-login .t-d {
		text-align: center;
		color: #999;
		margin: 80rpx 0
	}

	.t-login .t-e {
		text-align: center;
		margin: 80rpx auto 0
	}

	.t-login .t-f {
		text-align: center;
		margin: 80rpx 0 0 0;
		color: #666
	}

	.t-login .t-f text {
		margin-left: 8rpx;
		color: #999
	}

	.t-login .uni-input-placeholder {
		color: rgb(192, 196, 204);
	}

	.cl {
		zoom: 1
	}

	.cl:after {
		clear: both;
		display: block;
		visibility: hidden;
		height: 0;
		content: '\20'
	}
</style>
